import React, { useState, useEffect, forwardRef } from 'react';
import { Select } from 'antd';
import request from '@/utils/request';
// import { modifyProps } from '@/pages/Flow/Mine/Apply/utils';

const { Option } = Select;

const getTwoNumber = number => Math.round(number * 100) / 100;

// function getVal(value) {
//     return (
//         value === 'SgYear' ||
//         value === 'SgPaidLeave' ||
//         value === 'CnYear' ||
//         value === 'CnPaid'
//     );
// }
const getUnit = unit => {
    if (unit === 1 || unit === 2) {
        return '天';
    }
    return '小时';
};

/**
 * 请假类型
 */
const LeaveType = forwardRef((props, ref) => {
    const { value, onChange, data = [], startTime, endTime } = props;
    // 请假类型
    // const [data, setData] = useState([]);
    // 当前选中的请假类型
    const leaveType = data.find(item => item.leaveCode === value) || {};
    // 余额信息
    const [overMessage, setOverMessage] = useState({});
    // 都需要显示余额了
    const mustShowTime = true;
    // const [mustShowTime, setMustShowTime] = useState(true);
    const user = localStorage.getItem('user') ? JSON.parse(localStorage.getItem('user')) : {};

    const hanldeChange = newValue => {
        onChange(newValue);
    };

    const getYe = () => getTwoNumber(Number(overMessage.balance / 60));
    const getDe = () => getTwoNumber(Number(overMessage.balance / 480));
    // const getYx = () => Number(overMessage.balance / 60).toFixed(2);

    // useEffect(() => {
    //     const fetchData = async () => {
    //         const result = await request('/api/oa/v1/leavetype/typelist', {
    //             method: 'POST'
    //         });
    //
    //         if (result.code === 10000) {
    //             setData(result.data);
    //         }
    //     };
    //
    //     fetchData();
    // }, []);

    // useEffect(() => {
    //     setMustShowTime(getVal(value));
    // }, [getVal, value]);
    useEffect(() => {
        if (mustShowTime && value) {
            const fetchData = async () => {
                const result = await request('/api/work/v1/attendance/vocation/leavebalance', {
                    method: 'POST',
                    data: {
                        employeeCode: user.id,
                        leaveCode: value,
                        startTime,
                        endTime,
                        companyId: user.companyId
                    }
                });

                if (result.code === 10000) {
                    setOverMessage(result.data);
                }
            };

            fetchData();
        }
    }, [mustShowTime, value, startTime, endTime]);

    return (
        <React.Fragment>
            <Select value={value} {...props} onChange={hanldeChange} ref={ref}>
                {data.map(item => (
                    <Option key={item.leaveCode} value={item.leaveCode}>
                        {item.leaveName}
                    </Option>
                ))}
            </Select>
            {mustShowTime && typeof overMessage.balance !== 'undefined' && overMessage.flag !== 0 && (
                <div style={{ marginBottom: -16 }}>
                    当前{leaveType.leaveName}的余额为 {leaveType.leaveUnit === 3 ? getYe() : getDe()}{' '}
                    {getUnit(leaveType.leaveUnit)}
                    {overMessage.error ? <span style={{ color: 'red' }}>{`，${overMessage.error}`}</span> : ''}
                </div>
            )}
        </React.Fragment>
    );
});

export default LeaveType;
